/**
 * Created by ke.ouyang on 20/02/25
 * Email ke.ouyang@huilianyi.com
 */
import React from 'react';
import {connect} from 'react-redux';
import {messages} from "share/common";
import 'styles/components/template/in-page-stop-announcement/in-page-stop-announcement.scss';
import StopAnnounceService from 'components/template/stop-annonuce/stop-annonuce.service';

class inPageStopAnnouncement extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: undefined, //运维公告信息
      fold: true, //是否展示收起
    };
  }

  componentWillMount() {
    let data = JSON.parse(sessionStorage.getItem('announcementInfo'));
    if (data && data.id) {
      this.setState({data: data, fold: data.fold});
      this.getStopAnnounce(data);
    } else {
      this.getStopAnnounce();
    }
  }

  getStopAnnounce = (localData) => {
    let currentLang = JSON.parse(sessionStorage.getItem('HLY-lang'));
    let account = this.props.user.mobile || this.props.user.email;
    let userOID = this.props.user.userOID;
    let tenantId = this.props.user.tenantId;
    let language = this.props.user.language;
    if (language) {
      language = this.props.user.language.toLowerCase();
    }
    StopAnnounceService.getOperationAnnouncements(tenantId, userOID, account, language)
      .then((res) => {
        let data = res.data;
        if (data && data.type === 200) {
          if( localData ) {
            if (localData.lastUpdatedDate !== data.lastUpdatedDate) {
              this.setData(data);
            } else if (localData.currentLang !== currentLang) {
              this.setData(data);
            }
          } else {
            this.setData(data);
          }
        } else if (res.status === 200 && res.data.length === 0) { //没有公告
          this.setState({data: undefined, fold: true}, ()=>{
            sessionStorage.removeItem('announcementInfo');
          })
        }
      })
  };

  setData = (data) => {
    let currentLang = JSON.parse(sessionStorage.getItem('HLY-lang'));
    this.setState({data, fold: true});
    data.fold = true;
    data.currentLang = currentLang;
    sessionStorage.setItem('announcementInfo', JSON.stringify(data));
  };

  foldContent = () => {
    const { fold, data } = this.state;
    data.fold = !fold;
    this.setState({fold: !fold, data});
    sessionStorage.setItem('announcementInfo', JSON.stringify(data));
  };

  render() {
    const { data, fold } = this.state;
    return (
      <div className={(data && data.id) ? 'announcement-card marin-bottom' : 'announcement-card zero-height'}
            style={!fold ? {height: '48px'} : {}}>
        <div className="main-card">
          <div className="flex-box">
            <div className={fold ? 'title' : 'title one-line'}>
              {data && data.title}
            </div>
            <div className="fold-button" onClick={this.foldContent}>
              {fold ? messages('common.fold')/*收起*/ : messages('common-1.key126')/*展开*/ }
            </div>
          </div>
          <div className={(data && data.linkUrl) ? 'content' : 'content more-height'}>
            {data && data.content}
          </div>
          {
            (data && data.linkUrl) &&
            <a href={data && data.linkUrl} className="link-url" target="_blank">{data && data.linkName || data && data.linkUrl}</a>
          }
        </div>
      </div>
    );
  }
}

inPageStopAnnouncement.propTypes = {
  onRef: React.PropTypes.func,
};

inPageStopAnnouncement.contextTypes = {
  router: React.PropTypes.object
};
inPageStopAnnouncement.defaultProps = {};

function mapStateToProps(state) {
  return {
    profile: state.login.profile,
    user: state.login.user,
    tenantMode: state.main.tenantMode,
    company: state.login.company,
  }
}

export default connect(mapStateToProps)(inPageStopAnnouncement);



